import React,{ Component } from 'react';
import HomeHeader from './component/Home/hHeader';
import Swiper from './component/Home/swiper';
import Icons from './component/Home/icons';
import Recommend from './component/Home/recommend';
import Weekend from './component/Home/weekend';
import axios from 'axios';

class Home extends Component {
   
    constructor(props){
        super(props);
        this.state={
          swiperList:[],
          iconList:[],
          recommendList:[],
          weekendList:[],
        }
    };
    _getHomeData = () => {
        axios.get('https://www.easy-mock.com/mock/5b42fe459fb42c572b20c6cb/travle/index')
        .then( (response) => {
             this.setState({
                swiperList:response.data.data.swiperList,
                iconList:response.data.data.iconList,   
                recommendList:response.data.data.recommendList,
                weekendList:response.data.data.weekendList
             })
        })
        .catch( (error) => {
          console.log(error);
        });
    };

    componentDidMount = function () {
        this._getHomeData();
    };

    render() {
        return(
            <div className="Home">
               <HomeHeader/>
               <Swiper swiperData={this.state.swiperList}/>
               <Icons iconsData={this.state.iconList}/>
               <Recommend recommendData={this.state.recommendList}/>
               <Weekend weekendData={this.state.weekendList}/>
            </div>
        )
    }
}
export default Home;